<template>
	<view class="work_container">
		<view class="material-box">
			<view class="m-i-box" v-for="(item, index) in rowBox" :key="index">
				<template>
					<view class="i-t-name top">
						<view>施工工序{{ index + 1 }}</view>
						<view class="btn" @click="delColumn(index)">
							<u-button text="删除" type="error" size="small"></u-button>
						</view>
					</view>
					<view class="box-1" v-if="wrdObject.constructionMethod.indexOf('wrd') !== -1">
						<view class="i-t-name" @click="selectGongXu(index, 'wrd')">
							<view class="require-red">施工工序</view>
							<view class="right">
								<view :class="item.steelRingProcedureName ? 'r-v' : 'r-v opcity'">
									{{ item.steelRingProcedureName ? item.steelRingProcedureName : '请选择施工工序' }}
								</view>
								<u-icon name="arrow-right"></u-icon>
							</view>
						</view>
						<view class="i-t-name" @click="selectKongHao(index)">
							<view class="require-red">孔号</view>
							<view class="right">
								<view :class="item.processName ? 'r-v' : 'r-v opcity'">
									{{ item.processName ? item.processName : '请选择孔号' }}
								</view>
								<u-icon name="arrow-right"></u-icon>
							</view>
						</view>
						<!-- 开孔、闭孔工序：不显示水玻璃、水泥浆 todo -->
						<view class="unit-box" v-if="item.steelRingProcedureName === '注浆'">
							<view class="i-t-name">
								<view class="require-red">水玻璃</view>
								<view class="right">
									<u--input :type="inputType" v-model="item.loweGroutingAmount" placeholder="请输入数量" border="none" inputAlign="right"></u--input>
									<view style="margin-left: 10px">升</view>
								</view>
							</view>
							<view class="i-t-name">
								<view class="require-red">水泥浆</view>
								<view class="right">
									<u--input :type="inputType" v-model="item.sludgeGroutingAmount" placeholder="请输入数量" border="none" inputAlign="right"></u--input>
									<view style="margin-left: 10px">升</view>
								</view>
							</view>
							<view class="i-t-name">
								<view style="width: 360rpx">初始沉降值</view>
								<view class="right">
									<u--input
										:type="inputType"
										v-model="item.initialSettlementValue"
										placeholder="请输入数值"
										border="none"
										inputAlign="right"
										@input="changeNum('initialSettlementValue', index)"
									></u--input>
									<view style="margin-left: 10px">mm</view>
								</view>
							</view>
							<view class="i-t-name">
								<view style="width: 360rpx">注浆前沉降值</view>
								<view class="right">
									<u--input
										:type="inputType"
										v-model="item.settlementValueBeforeGrouting"
										placeholder="请输入数值"
										border="none"
										inputAlign="right"
										@input="changeNum('settlementValueBeforeGrouting', index)"
									></u--input>
									<view style="margin-left: 10px">mm</view>
								</view>
							</view>
							<view class="i-t-name">
								<view style="width: 360rpx">注浆后沉降值</view>
								<view class="right">
									<u--input
										:type="inputType"
										v-model="item.settlementValueAfterGrouting"
										placeholder="请输入数值"
										border="none"
										inputAlign="right"
										@input="changeNum('settlementValueAfterGrouting', index)"
									></u--input>
									<view style="margin-left: 10px">mm</view>
								</view>
							</view>
						</view>
					</view>
					<!--  维保类、前期、其他 工序-->
					<view class="box-2" v-else>
						<view class="i-t-name" @click="selectGongXu(index, 'otherType')">
							<view class="require-red">施工工序</view>
							<view class="right">
								<view :class="item.steelRingProcedureName ? 'r-v' : 'r-v opcity'">
									{{ item.steelRingProcedureName ? item.steelRingProcedureName : '请选择施工工序' }}
								</view>
								<u-icon name="arrow-right"></u-icon>
							</view>
						</view>
						<view class="i-t-name">
							<view class="require-red">工作量</view>
							<view class="right">
								<view style="margin-right: 20rpx">
									<u--input
										type="number"
										placeholder="请输入工作量"
										inputAlign="right"
										placeholderStyle="fontSize:16px;color: #586981;opacity: 0.5"
										border="none"
										v-model="item.workload"
									></u--input>
								</view>
								<view v-if="item.measureUnit" style="min-width: 100rpx; text-align: center">
									{{ item.measureUnit }}
								</view>
							</view>
						</view>
					</view>

					<view style="font-size: 32rpx; margin: 10rpx 0; padding-left: 30rpx">施工图片</view>
					<view class="grid_img">
						<u-upload
							:fileList="rowBox[index].fileListImg"
							@afterRead="afterRead($event, index)"
							@delete="deletePic($event, index)"
							name="Img"
							multiple
							:maxCount="9"
							:previewFullImage="true"
							accept="image"
						></u-upload>
					</view>
				</template>
			</view>
		</view>
		<u-button type="primary" icon="plus" :plain="true" text="添加工作量明细" @click="addColumn"></u-button>
		<!-- <view class="little_count"> 小计 {{rowBox.length}}孔次</view> -->
		<level-linkage
			:ref="`levelLinkage`"
			title="孔号"
			showType="wrd"
			:pickerValueDefault="pickerValueDefault"
			@showPopup="clickCancel('konghao', $event)"
			:allData="treeData2"
			@cancel="clickCancel('konghao')"
			@onConfirm="onConfirm"
			themeColor="#007AFF"
		></level-linkage>

		<u-picker :show="showGongfa" :columns="[columns]" @confirm="clickSure($event, 'picker')" @cancel="clickCancel('gongfa')" keyName="label"></u-picker>
		<u-action-sheet
			round="10"
			:actions="actionList"
			@select="clickSure($event, 'sheet')"
			@close="showAction = false"
			cancelText="取消"
			:closeOnClickOverlay="true"
			:closeOnClickAction="true"
			:show="showAction"
		></u-action-sheet>
	</view>
</template>

<script>
import { mapMutations } from 'vuex';
import levelLinkage from '@/components/three-level-linkage/linkage.nvue';
//工序列表
import { steelRingProcedureGetList, pmPlanWorkloadList } from '@/api/comprehensive/comprehensive.js';
import { uploadFile } from '@/utils/request';
import { getToken } from '@/utils/auth.js';
import { getPicture, deleteImg, doc_deleteAttachs } from '@/api/doc.js';
import mixins from '@/utils/mixins.js';
import fileMixin from '@/mixins/file.js';
export default {
	mixins: [mixins, fileMixin],
	components: { levelLinkage },
	props: {
		wrdObject: Object,
		default: () => ({})
	},
	data() {
		return {
			pickerValueDefault: [0, 0],
			pickerText: '',
			treeData: [],
			itemIndex: -1, // 当前点击选择器的下标
			type: '', // 进度填报工作量类型 1钢环 2微扰动
			name: '工作量',
			list: [{ name: '工作量' }, { name: '材料消耗' }],
			isShowName: false,
			rowBox: [
				{
					steelRingProcedureName: '',
					steelRingProcedureId: '',
					processName: '', //孔号
					loweGroutingAmount: '', //水玻璃
					sludgeGroutingAmount: '', //水泥浆
					initialSettlementValue: '',
					settlementValueBeforeGrouting: '',
					settlementValueAfterGrouting: '',
					ringNumber: '', // 环号
					fileListImg: [], //视频照片 //图片
					docId: '', //图片id  后续接口要用
					updateIds: []
				}
			],
			rules: {},
			columnData: [], // 孔号二级数组
			fileListImg: [], //视频照片
			ringsList: [], // 环号数组
			letter: [], //字母数组
			formData: {}, //上传图片对象
			showGongfa: false,
			gongxuArr: [],
			showAction: false,
			actionList: [],
			showPopup: false,
			inputType: 'number',
			deleteFileImgs: []
		};
	},

	async mounted() {
		// #ifdef MP-WEIXIN
		this.inputType = 'digit';
		// #endif
		await this.getConstructionMethodList(this.wrdObject);
		await this.getRingList();
	},
	computed: {
		columns() {
			// console.debug(this.treeData, '处理后数据')
			if (this.treeData.length) {
				return this.gongxuArr.map((it) => ({
					...it,
					label: it.name,
					treeData: JSON.parse(JSON.stringify(this.treeData))
				}));
			}
			if (this.wrdObject.constructionMethod === 'wbl') {
				return this.gongxuArr.map((it) => ({
					...it,
					label: it.makt
				}));
			}
			return [];
		},
		treeData2() {
			if (this.itemIndex > -1) {
				// debugger
				if (this.rowBox[this.itemIndex]) {
					const it = this.columns.find((it) => it.label === this.rowBox[this.itemIndex].steelRingProcedureName);
					if (it) {
						this.tempArr.forEach((item) => {
							it.treeData.forEach((kt, ki) => {
								if (kt.children && kt.name == item.name) {
									this.arrDisabled(kt.children, true, item.value);
								}
							});
						});
					}

					return (it && it.treeData) || [];
				} else {
					return [];
				}
			} else {
				return [];
			}
		}
	},
	watch: {
		treeData2(v) {
			this.handlerdeletion();
		}
	},
	methods: {
		changeNum(key, index) {
			// 使用正则表达式提取符合要求的数字
			// #ifdef APP-PLUS || H5
			const result = this.rowBox[index][key].match(/^(-)?\d+(\.\d{1,2})?$/);
			// 如果找到了匹配的数字，返回它；否则返回空字符串
			this.rowBox[index][key] = result ? result[0] : '';
			// #endif
			// #ifdef MP-WEIXIN
			const value = this.rowBox[index][key];
			let array = value.split('.');
			if (array.length > 2) {
				// debugger
				this.rowBox[index][key] = (array[0] || 0) + '.' + array.slice(1).join('');
			} else {
				const strArr = value.split('.')[1];
				// console.log(strArr.length, '唱反调')
				if (strArr && strArr.length > 2) {
					this.rowBox[index][key] = '';
				}
			}

			// #endif
		},
		// 处理孔号切换时未选择的取消禁用
		handlerdeletion() {
			const names = this.rowBox.map((it) => it.steelRingProcedureName);
			const found = this.columns.filter((it) => !names.includes(it.name));
			const existing = this.columns.filter((it) => names.includes(it.name));
			if (found.length) {
				found.forEach((it) => {
					it.treeData.forEach((kt) => {
						kt.children.forEach((jt) => {
							this.$set(jt, 'disabled', false);
						});
					});
				});
			}
		},
		//获取施工工序数组
		getConstructionMethodList(obj, projectId = uni.getStorageSync('isOwner')) {
			steelRingProcedureGetList({
				projectId,
				pmId: obj.pmId,
				lineId: obj.lineId,
				lineSiteSectionId: obj.lineSiteSectionId,
				lineSiteSectionType: obj.lineSiteSectionType,
				constructionMethod: obj.constructionMethod
			}).then((res) => {
				if (!res.success) return;
				if (obj.constructionMethod.indexOf('wrd') !== -1) {
					this.gongxuArr = res.result || [];
				} else {
					this.actionList =
						res.result.map((it) => ({
							...it,
							measureUnit: it.unit,
							disabled: false
						})) || [];
				}
			});
		},

		//选择孔号方法
		selectKongHao(index) {
			this.itemIndex = index;
			if (!this.rowBox[this.itemIndex].steelRingProcedureName) {
				return uni.showToast({
					title: `请先选择施工工序`,
					icon: 'none'
				});
			}

			this.isShowName = true;
			this.$refs.levelLinkage.open();
		},
		selectGongXu(index, type) {
			this.itemIndex = index;
			if (type === 'wrd') {
				this.showGongfa = true;
			} else {
				if (this.actionList.length === 0) {
					return uni.showToast({
						title: '暂无工序列表',
						icon: 'none'
					});
				}
				this.actionList.forEach((it) => {
					it.disabled = false;
					if (this.rowBox.find((item) => item.steelRingProcedureId === it.id)) {
						it.disabled = true;
					}
				});
				this.showAction = true;
			}
		},

		clickSure(e, type) {
			console.log(e, type, this.actionList, '307行');
			if (type === 'picker') {
				this.rowBox[this.itemIndex].steelRingProcedureName = e.value[0].label;
				this.rowBox[this.itemIndex].steelRingProcedureId = e.value[0].id;
				this.rowBox[this.itemIndex].processName = '';
				this.rowBox[this.itemIndex].loweGroutingAmount = '';
				this.rowBox[this.itemIndex].sludgeGroutingAmount = '';
				this.rowBox[this.itemIndex].initialSettlementValue = '';
				this.rowBox[this.itemIndex].settlementValueBeforeGrouting = '';
				this.rowBox[this.itemIndex].settlementValueAfterGrouting = '';
				this.rowBox[this.itemIndex].docId = '';
				this.rowBox[this.itemIndex].fileListImg = [];
				this.rowBox[this.itemIndex].workload = e.value[0].workload;
				this.showGongfa = false;
			} else {
				this.rowBox[this.itemIndex].steelRingProcedureName = e.name;
				this.rowBox[this.itemIndex].steelRingProcedureId = e.id;
				this.rowBox[this.itemIndex].measureUnit = e.measureUnit || '';
				this.rowBox[this.itemIndex].workload = '';
				console.log(this.rowBox, this.actionList, 'this.rowBox');
				this.actionList.forEach((it) => {
					it.disabled = false;
					if (this.rowBox.find((item) => item.steelRingProcedureId === it.id)) {
						it.disabled = true;
					}
				});
				this.showAction = false;
			}
			this.itemIndex = -1;
			console.log(this.treeData2, '工序确定按钮', this.itemIndex, this.rowBox);
		},
		clickCancel(type, e) {
			if (type === 'gongfa') {
				this.showGongfa = false;
			}
		},
		//获取数据
		getRingList() {
			let resq = {
				params: {
					pmId: this.wrdObject.pmId, //项目id
					lineSiteSectionType: this.wrdObject.lineSiteSectionType, //站点区间类型(字典表-line_site_section_type)
					lineSiteSectionId: this.wrdObject.lineSiteSectionId, //站点或区间id
					constructionMethod: this.wrdObject.constructionMethod //施工工法（字典表-construction_method）
				},
				currPage: 1,
				pageSize: 9999
			};
			pmPlanWorkloadList(resq).then((res) => {
				let wrdRes = res.result.list[0];
				let temp = res.result.list[0].ringNumbers;
				this.ringsList = this.getRingNumbers(temp);
				//  获取上下行数据 组成英文字母表A-Z
				let englishArr = Number(wrdRes.downFloor) + Number(wrdRes.upFloor);
				let Num1 = Number(wrdRes.upFloor);
				let Num2 = Number(wrdRes.downFloor);
				let tempLetterArr = [];
				if (Num1) {
					for (let i = 0; i < Num1; i++) {
						tempLetterArr.push(this.IdOf_v2(i + 1, true));
					}
				}
				if (Num2) {
					for (let i = 0; i < Num2; i++) {
						tempLetterArr.push(this.IdOf_v2(i + 1));
					}
				}

				if (isNaN(englishArr)) {
					//TODO: 提示数据错误
					return;
				}
				this.columnData = this.ringsList;
				this.treeData = tempLetterArr.map((it, index) => {
					return {
						id: index,
						name: it,
						disabled: false,
						children: this.columnData.map((kt, ki) => {
							return {
								id: ki,
								name: kt,
								disabled: false
							};
						})
					};
				});
				// console.debug('看选择器数据treeData', this.treeData)
				//暂存状态才执行这个 从workLoad页面的mounted获取数据
				if (this.rowBox.isEdit) {
					// 需要找到对应工序然后再将对应工序已填报的孔号禁用
					this.rowBox.forEach((it1) => {
						// debugger
						this.columns.forEach((it2) => {
							if (it1.steelRingProcedureName == it2.name) {
								it2.treeData.forEach((it3) => {
									if (it3.name == it1.processName.match(/[a-zA-Z]\d+/g)[0]) {
										it3.children.forEach((it4) => {
											if (it4.name == it1.processName.match(/^\d+(?=[a-zA-Z])/)[0]) {
												it4.disabled = true;
											}
										});
									}
								});
							}
						});
					});
				}
				let resultArr = [];
				/**
				 * 将不需要注浆的孔号 处理成对象数组[{A：B101},{b:105}]
				 * 改了， 内侧：n 外侧: w
				 */
				wrdRes.noNeedGroutingWells.split(',').forEach((it) => {
					let titleIndex = -1;
					if (it.indexOf('w') !== -1) {
						titleIndex = it.split('w')[1].length + 1;
					} else if (it.indexOf('n') !== -1) {
						titleIndex = it.split('n')[1].length + 1;
					}
					let obj = {
						name: it.slice(it.length - titleIndex),
						value: it.slice(0, it.length - titleIndex)
					};
					it && resultArr.push(obj);
				});
				this.tempArr = resultArr;
			});
		},
		// 把数字转字母
		IdOf(i) {
			return (i >= 26 ? idOf(((i / 26) >> 0) - 1) : '') + 'abcdefghijklmnopqrstuvwxyz'[i % 26 >> 0];
		},
		IdOf_v2(i, isUp) {
			return isUp ? `w${i}` : `n${i}`;
		},
		// 601-610,611,612 特定字符串转成数组
		getRingNumbers(strNo = '') {
			const result = [];
			strNo.split(',').forEach((rr) => {
				let [s, e] = rr.split('-');
				e = e || s;
				while (Number(s) <= Number(e)) result.push(s++);
			});
			return result;
		},
		// 添加按钮事件
		addColumn() {
			console.log(this.rowBox);
			for (let i = 0; i < this.rowBox.length; i++) {
				if (this.wrdObject.constructionMethod.indexOf('wrd') !== -1) {
					if (this.rowBox[i].steelRingProcedureName === '注浆') {
						if (
							!this.rowBox[i].processName ||
							!this.rowBox[i].steelRingProcedureName ||
							this.rowBox[i].loweGroutingAmount === '' ||
							this.rowBox[i].sludgeGroutingAmount === ''
						) {
							return uni.showToast({
								title: `请填写完整第${i + 1}项的数据`,
								icon: 'none'
							});
						}
					} else {
						if (!this.rowBox[i].processName || !this.rowBox[i].steelRingProcedureName) {
							return uni.showToast({
								title: `请填写完整第${i + 1}项的数据`,
								icon: 'none'
							});
						}
					}
				} else {
					if (!this.rowBox[i].steelRingProcedureName || !this.rowBox[i].workload) {
						return uni.showToast({
							title: `请填写完整第${i + 1}项的数据`,
							icon: 'none'
						});
					}
				}
			}
			this.rowBox.push({
				processName: '',
				steelRingProcedureId: '',
				steelRingProcedureName: '',
				ringNumber: '',
				fileListImg: [], //视频照片 //图片
				docId: '', //图片id  后续接口要用
				loweGroutingAmount: '', //水玻璃
				sludgeGroutingAmount: '', //水泥浆
				initialSettlementValue: '',
				settlementValueBeforeGrouting: '',
				settlementValueAfterGrouting: ''
			});
		},
		// 删除行按钮事件
		delColumn(index) {
			console.log(this.rowBox[index], '删除');
			if (this.rowBox.length <= 1) {
				return uni.showToast({
					title: '至少保留一项',
					icon: 'none'
				});
			}
			if (this.rowBox[index].processName) {
				const found = this.columns.find((kt) => kt.name === this.rowBox[index].steelRingProcedureName);
				// debugger
				if (found) {
					let matchs = [];
					try {
						matchs = [
							this.rowBox[index].processName.match(/[a-zA-Z]\d+/g)[0], // 开头
							this.rowBox[index].processName.match(/^\d+(?=[a-zA-Z])/)[0] // 结尾
						];
					} catch (e) {
						console.error('正则匹配错误，请检查', this.rowBox, index, e);
						throw e;
					}
					const temp = found.treeData.find((it) => String(it.name) === matchs[0]);
					let temp2 = temp.children.find((it) => String(it.name) === matchs[1]);
					temp2 && this.$set(temp2, 'disabled', false);
				}
			}
			if (this.wrdObject.constructionMethod.indexOf('wrd') === -1) {
				this.actionList.forEach((it) => {
					if (this.rowBox[index].steelRingProcedureId === it.id) {
						it.disabled = false;
					}
				});
			}
			this.rowBox.splice(index, 1);
		},
		onCancel() {
			this.itemIndex = -1;
		},
		/**
		 * 选择器的确定按钮
		 * 这里组件内部val的id为下标,不是数据库内的id
		 * @param {Object} val
		 */
		onConfirm(val) {
			console.debug(val, '选择器的确定按钮');
			let titleIndex = val.name.split('/')[0].length;
			// 将要选择的
			let selectName = [...val.name.split('/')].reverse().join('');
			// 之前选择的
			let oldName = undefined;
			// 如果在之前选择的有值 , 获取到并取消禁用状态
			!this.rowBox[this.itemIndex].processName &&
				(oldName = {
					title: this.rowBox[this.itemIndex].processName.slice(this.rowBox[this.itemIndex].processName.length - titleIndex), //孔号的首字符 w1 n
					name: this.rowBox[this.itemIndex].processName.slice(0, this.rowBox[this.itemIndex].processName.length - titleIndex) //孔号 11、12
				});
			// 禁用当前选择的
			// debugger
			console.debug(oldName, 'oldName');
			this.treeData2.forEach((it) => {
				const splitArr = val.name.split('/');
				// debugger
				// 如果之前选择的有值
				if (oldName) {
					if (it.name === oldName.title) {
						this.arrDisabled(it.children, false, oldName.name);
					}
				}
				if (it.name === splitArr[0]) {
					const otherItem = this.rowBox.filter(
						(kt, index) => index !== this.itemIndex && kt.steelRingProcedureName === this.rowBox[this.itemIndex].steelRingProcedureName
					);
					console.debug(otherItem, 'otherItem');
					it.children.forEach((kt, index) => {
						if (kt.name == splitArr[1]) {
							kt.disabled = true;
						}
					});
				}
			});

			this.rowBox[this.itemIndex].processName = selectName;
			//后续接口要用的
			this.rowBox[this.itemIndex].ringNumber = selectName;
			//切换后清除图片和注浆量
			this.rowBox[this.itemIndex].loweGroutingAmount = '';
			this.rowBox[this.itemIndex].sludgeGroutingAmount = '';
			this.rowBox[this.itemIndex].initialSettlementValue = '';
			this.rowBox[this.itemIndex].settlementValueBeforeGrouting = '';
			this.rowBox[this.itemIndex].settlementValueAfterGrouting = '';
			this.rowBox[this.itemIndex].docId = '';
			this.rowBox[this.itemIndex].fileListImg = [];

			this.itemIndex = -1;
		},
		/**
		 *  数组循环如果匹配添加禁用属性
		 * @param {Array} arr object数组 元素最少得有个name属性
		 * @param {Boolean} isDisabled 改变的状态
		 * @param {String} name 匹配的名字
		 * @return {Number} disabledCount 禁用数
		 */
		arrDisabled(arr, isDisabled, name) {
			let disabledCount = -1;
			arr.forEach((it, index) => {
				if (it.name == name) {
					disabledCount = index;
					it.disabled = isDisabled;
				}
			});
			// console.debug(arr)
			return disabledCount;
		},
		// 删除图片
		async deletePic(event, index) {
			if (event.file.id) {
				this.deleteFileImgs.push(event.file.id);
			}
			this.rowBox[index].fileListImg.splice(event.index, 1);
		},
		
		async deleteFiles() {
			const array = [...this.deleteFileImgs];
			if (array.length) {
				await doc_deleteAttachs(array);
			}
		},
		
		uploadFileListAttach() {
			return new Promise(async (resolve, reject) => {
				for(let item of this.rowBox) {
					if (item.fileListImg.length) {
						const array = item.fileListImg.filter((it) => !it.id);
						const dataList = this.addWaterTxt(item);
						//施工前照片id
						item.docId = await this.uploadWaterMark(array, dataList, item.docId, { token: getToken() }, {}, 'file');
					}
				}
				resolve();
			});
		},
		addWaterTxt(obj) {
			let formData = {};
			const dateTime = this.getDate2(new Date());
			const fingNumber = obj.ringNumber + (['snwrd', 'swwrd'].includes(this.wrdObject.constructionMethod) ? '孔' : '');
			const name = obj.steelRingProcedureName;
			let arrList = [fingNumber, name, dateTime];
			return arrList
		},
		// 新增图片
		async afterRead(event, index) {
			for (let item in event.file) {
				this.rowBox[index].fileListImg.push({
					...event.file[item]
				});
			}
			this.$forceUpdate();
		},
		/**
		 * 获取到docId中的图片并且拼成网络路径格式
		 * @param {Number} docId
		 * @return {String} //拼好的网络路径格式
		 */
		async getItemImage(docId) {
			return await new Promise((resolve, reject) => {
				getPicture({
					docId
				})
					.then((res) => {
						resolve(
							res.result.map((it) => ({
								id: it.id,
								url: this.$config.IMG_FILE_URL + it.fileName
							}))
						);
					})
					.catch((err) => reject(err));
			});
		}
	}
};
</script>

<style lang="scss" scoped>
// 表单校验提示文字
::v-deep.content .u-form .u-form-item .u-form-item__body__right__message {
	margin-left: 278rpx !important;
}

.work_container {
	height: 100%;
	width: 100%;
}

.item_top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 20rpx;

	.top_reduce {
		// cursor: pointer;
		color: #16a7df;
	}
}

.content {
	padding: 35rpx;

	.value {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.value-nav {
		position: relative;

		.day {
			position: absolute;
			top: 10rpx;
			right: -50rpx;
		}
	}

	.addArea {
		width: 100%;
		height: 96rpx;
		line-height: 96rpx;
		background: #f5f7fa;
		font-size: 32rpx;
		font-weight: bold;
		color: #445469;
		margin-top: 40rpx;
		text-align: center;
		margin-bottom: 40rpx;

		.image {
			width: 50rpx;
			height: 50rpx;
			margin-bottom: -13rpx;
		}
	}
}

.little_count {
	margin-top: 30rpx;
	text-align: right;
	padding-right: 20rpx;
}

.btn_box {
	height: 100rpx;

	.btn_group {
		display: flex;
		align-items: center;
		justify-content: space-between;
		// margin-top: 100rpx;
		position: fixed;
		bottom: 0;
		width: 100%;
	}
}

.value2 {
	display: flex;
	align-items: center;
	text-align: right;

	.none {
		flex: 1;
	}
}

.value-nav {
	position: relative;

	.day {
		position: absolute;
		top: 10rpx;
		right: -50rpx;
	}
}

.footer {
	position: relative;
	width: 100%;

	// height: 100rpx;
	.image {
		position: absolute;
		bottom: 0rpx;
		right: 140rpx;
		width: 60rpx;
		height: 60rpx;
	}

	.select {
		position: absolute;
		bottom: 6rpx;
		right: 60rpx;
		font-size: 32rpx;
	}

	.num {
		position: absolute;
		bottom: 24rpx;
		right: 120rpx;
		padding: 5rpx 15rpx;
		border-radius: 30rpx;
		background-color: #f43530;
		color: #fff;
		z-index: 1;
	}
}

/deep/ .u-form-item__body__right__content__slot {
	flex-direction: column;
}

/deep/ .define-block {
	display: block;
}

/deep/ .u-upload__wrap {
	width: 85%;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	flex: 1;
}

.material-box {
	margin: 0 20rpx 20rpx 20rpx;
	padding-top: 20rpx;

	.m-i-box {
		padding: 10rpx 20rpx;
		background: #fff;
		margin-bottom: 20rpx;
		border-radius: 5px;

		.i-t-name {
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-bottom: 1px solid #ededed;
			padding: 28rpx;
			font-size: 32rpx;
			font-weight: 500;
			color: #586981;

			.require-red {
				width: 340rpx;
			}

			.require-red::before {
				content: '*';
				color: red;
			}

			.btn {
				width: 130rpx;
			}

			.right {
				display: flex;
				align-items: center;

				.r-v {
					margin-right: 18rpx;
				}

				.r-v.opcity {
					opacity: 0.6;
				}
			}
		}

		.i-t-name.top {
			padding: 28rpx 10rpx;
			font-size: 36rpx;
			font-weight: bold;
			color: #445469;
		}

		.i-t-name.bottom {
			border: none;
		}
	}
}
</style>
